import 'package:flutter/material.dart';

class ButtonStylePage extends StatefulWidget {
  @override
  _ButtonStylePageState createState() => _ButtonStylePageState();
}

class _ButtonStylePageState extends State<ButtonStylePage> {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: new Text("按钮"),
      ),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: <Widget>[
          /**
           * RaisedButton 即"漂浮"按钮，它默认带有阴影和灰色背景。按下后，阴影会变大
           */
          RaisedButton(
            onPressed: () {},
            child: Text("normal"),
          ),
          /**
           * FlatButton即扁平按钮，默认背景透明并不带阴影。按下后，会有背景色
           */
          FlatButton(onPressed: () {}, child: Text("normal")),
          /**
           * OutlineButton默认有一个边框，不带阴影且背景透明。按下后，边框颜色会变亮、同时出现背景和阴影(较弱)
           */
          OutlineButton(
            onPressed: () {},
            child: Text("normal"),
          ),
          /**
           * IconButton是一个可点击的Icon，不包括文字，默认没有背景，点击后会出现背景
           */
          IconButton(
            icon: Icon(Icons.thumb_up),
            onPressed: () {},
          ),
          RaisedButton.icon(
            icon: Icon(Icons.send),
            label: Text("发送"),
            onPressed: () {},
          ),
          /**
           *  this.textColor, //按钮文字颜色
            this.disabledTextColor, //按钮禁用时的文字颜色
            this.color, //按钮背景颜色
            this.disabledColor,//按钮禁用时的背景颜色
            this.highlightColor, //按钮按下时的背景颜色
            this.splashColor, //点击时，水波动画中水波的颜色
            this.colorBrightness,//按钮主题，默认是浅色主题
            this.padding, //按钮的填充
            this.shape, //外形
            @required this.child, //按钮的内容
           */
          FlatButton(
            color: Colors.blue,
            highlightColor: Colors.blue[700],
            colorBrightness: Brightness.dark,
            splashColor: Colors.grey,
            child: Text("Submit"),
            shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(20.0)),
            onPressed: () {},
          ),
            FlatButton(
              onPressed: (){},
              child: Text("提交"),
              color: Colors.red,
              highlightColor: Colors.red[700],
              colorBrightness: Brightness.light,
              splashColor: Colors.grey,
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(20.0)
              ),
            )
        ],
      ),
    );
  }
}
